﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>学中医</title>
    <!--css样式-->
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <!--脚本文件-->
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="~/Scripts/vue.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $.get("home/NewArticles", function (result) {
                app.articles = $.parseJSON(result);
            });
            $.get("home/Bloger", function (result) {
                app.bloger = $.parseJSON(result);
            });
            $.get("home/websites", function (result) {
                app.websites = $.parseJSON(result);
            });
            $.get("home/books", function (result) {
                app.books = $.parseJSON(result);
            });
        });
    </script>
</head>
<body>
    <div id="app">
        <div class="container" style="width:80%">
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">注意事项</div>
                        <div class="panel-body">
                            本网站致力于为中医爱好者推荐网络资源。欢迎大家推荐好的资源。<br />
                            <a href="">我要推荐</a>
                        </div>
                    </div>

                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="panel panel-info">
                        <div class="panel-heading">最新文章</div>
                        <div class="panel-body">

                            <div v-for="(item,index) in articles">
                                <a v-bind:href="item.ArticleUrl" target="_blank">{{item.ArticleName}}</a>
                            </div>

                        </div>
                    </div>

                </div>
                <div class="col-md-6">
                    <div class="panel panel-info">
                        <div class="panel-heading">推荐阅读</div>
                        <div class="panel-body">
                            Basic panel example
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">网站推荐</div>
                        <div class="panel-body">
                            <span v-for="(item,index) in websites">
                                <a v-bind:href="item.WebUrl" target="_blank"  style="padding:5px;">{{item.WebName}}</a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">博客推荐</div>
                        <div class="panel-body">
                            <span v-for="(item,index) in bloger">
                                <a v-bind:href="item.WebUrl" target="_blank" style="padding:5px;">{{item.AuthorName}}</a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">公众号</div>
                        <div class="panel-body">

                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">书籍</div>
                        <div class="panel-body">
                            <span v-for="(item,index) in books">
                                <a v-bind:href="item.Id" target="_blank" style="padding:5px;">{{item.BookName}}</a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">病例</div>
                        <div class="panel-body">

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>   <!--app-->
</body>
<script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data: {
            articles: [],
            bloger: [],
            websites: [],
            books:[]
        }
    })

</script>
</html>
